<div class="table-bar">
    <a [routerLink]="['/admin/bearing/add']"
    	class="button button-small button-primary button-rounded">
        <i class="fa fa-plus" aria-hidden="true"></i> 录入轴承
    </a>&nbsp;&nbsp;
    <a href="####"
    	class="button button-small button-caution button-rounded">
        <i class="fa fa-trash" aria-hidden="true"></i> 删除
    </a>
</div>
<table class="table table-striped table-hover">
	<thead>
		<tr>
			<th>轴承类型</th>
			<th>品牌</th>
			<th>新型号</th>
			<th>旧型号</th>
			<th>内径(mm)</th>
			<th>外径(mm)</th>
			<th>宽度(mm)</th>
			<th></th>
		</tr>
	</thead>
	<tbody>
		<tr *ngFor="let bear of bearings" (click)="onSelect(bear)" [class.selected]="bear === selectedBear">
			<td>{{bear.types}}</td>
			<td>{{bear.brand}}</td>
			<td>{{bear.new_style }}</td>
			<td>{{bear.old_style }}</td>
			<td>{{bear.inside_diameter }}</td>
			<td>{{bear.outside_diameter }}</td>
			<td>{{bear.thickness }}</td>
			<td width="50" class="is_select"><i class="fa fa-arrow-right" aria-hidden="true"></i></td>
		</tr>
	</tbody>
</table>
<hr/>
<div class="row pages">
	<div class="col-xs-4 text-left">
		<button type="button" class="button button-small button-rounded" (click)="goPrevPage()">上一页</button>
	</div>
	<div class="col-xs-4">
		<div class="input-group input-group-sm" style="width:128px; margin:0 auto;">
			<span class="input-group-addon">跳至</span>
			<input type="text" class="form-control" placeholder="页码">
			<span class="input-group-btn">
		        <button class="btn btn-default" type="button">
		        	<i class="fa fa-paper-plane-o" aria-hidden="true" style="line-height: 1.42857143"></i>
		        </button>
	      </span>
		</div>
	</div>
	<div class="col-xs-4 text-right">
		<button type="button" class="button button-small button-rounded" (click)="goNextPage()">下一页</button>
	</div>
</div>
<hr/>
<p class="help-block text-right">
	当前第 <kbd>{{pageNum}}</kbd> 页，共 <code>{{totalRecords}}</code> 条数据
</p>